<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>学知鸟</title>
		<link rel="shortcut icon" href="../../share/img/logo.png">
		<link rel="stylesheet" href="../../share/css/main.css">
	</head>
	<body>
		<div class="row">
			<div class="col-1">
				<section>
					<h3>绝对单位</h3>
					<table class="grid">
						<thead>
							<tr>
								<th>名称</th>
								<th>含义</th>
							</tr>
						</thead>
						<tbody>
							<tr>
								<td>cm</td>
								<td>厘米</td>
							</tr>
							<tr>
								<td>mm</td>
								<td>毫米</td>
							</tr>
							<tr>
								<td>in</td>
								<td>英寸 (1in = 96px = 2.54cm)</td>
							</tr>
							<tr>
								<td>px</td>
								<td>像素 (1px = 1/96 in)</td>
							</tr>
							<tr>
								<td>pt</td>
								<td>点 (1pt = 1/72in)</td>
							</tr>
							<tr>
								<td>pc</td>
								<td>pica (1pc = 12 pt)</td>
							</tr>
						</tbody>
					</table>
				</section>
			</div>
			<div class="col-1">
				<section>
					<h3>相对单位</h3>
					<table class="grid stripe">
						<thead>
							<tr>
								<th>名称</th>
								<th>含义</th>
							</tr>
						</thead>
						<tbody>
							<tr>
								<td>em</td>
								<td>相对于当前元素的字体大小，一般浏览器字体大小默认为16px</td>
							</tr>
							<tr>
								<td>ex</td>
								<td>英文字母小 x 的高度</td>
							</tr>
							<tr>
								<td>ch</td>
								<td>数字 0 的宽度</td>
							</tr>
							<tr>
								<td>rem</td>
								<td>root em的缩写，相对于根元素的字体大小</td>
							</tr>
							<tr>
								<td>vw</td>
								<td>viewpoint width，视窗宽度，1vw=视窗宽度的1%</td>
							</tr>
							<tr>
								<td>vh</td>
								<td>viewpoint height，视窗高度，1vh=视窗高度的1%</td>
							</tr>
							<tr>
								<td>vmin</td>
								<td>vw和vh中较小的那个。</td>
							</tr>
							<tr>
								<td>vmax</td>
								<td>vw和vh中较大的那个。</td>
							</tr>
							<tr>
								<td>%</td>
								<td></td>
							</tr>
						</tbody>
					</table>
				</section>

			</div>
		</div>
	</body>
</html>
